<%@ page language="java" contentType="text/html; charset=UTF-8"
		 pageEncoding="UTF-8"%>

<script>
    var search_type_student = "none";
    var search_keyWord = "";
    var selectID,action = null,fileName;

    $(function() {

        init();
        searchAction();
        dataListInit();
        bootstrapValidatorInit();

        submitAction();
        deleteAction();
        deleteBatchAction();
    })

	function init(){

        var lessons = '${lessons}'.replace(/\s|\xA0/g,"");
        var lessonsArr = lessons.substr(1,lessons.length-2).split(",");
        lessonsArr.forEach(function (item, index){
            var options = '"<option value=\"'+item+'\" selected>'+item+'</option>"';
            $("#subjectSearch").append(options);
        });
        $("#subjectSearch").append('"<option value="" selected>'+"--全部--"+'</option>"');
	}
    // 搜索动作
    function searchAction() {
        $('#search_button').click(function() {
            search_keyWord = $('#search_input').val();
            tableRefresh();
        })
    }

    // 分页查询参数
    function queryParams(params) {

        var temp = {
            limit : params.limit,
            offset : params.offset,
            teacherName:$('#teacherSearch').val(),
            subjectType:$('#subjectSearch').val(),
            teacherPhone:$('#phoneSearch').val()
        }
        return temp;
    }

    // 表格初始化
    function dataListInit() {
        $('#dataList').bootstrapTable(
            {
                columns : [{
                    checkbox: true,
                    align: 'center'
                }, {
                    title: 'ID',
                    formatter: function (value, row, index) {
                        return index+1;
                    },
                    align: "center"
                },
                    {
                        field : 'teacher_name',
                        title : '姓名'
                    },
                    {
                        field : 'teacher_sex',
                        title : '性别'
                    },
                    {
                        field : 'teacher_phone',
                        title : '手机号'
                    },
                    {
                        field : 'subject_type',
                        title : '教授科目'
                    },
                    {
                        field : 'operation',
                        title : '操作',
                        width: 180,
                        align: 'center',
                        valign: 'middle',
                        formatter : function(value, row, index) {
                            var a = '<button class="btn btn-info btn-sm edit"><span>编辑</span></button>';
                            var s = '<button id="editPwd" class="btn btn-info btn-sm editPwd"><span>重置密码</span></button>';
                            var d = '<button class="btn btn-danger btn-sm delete"><span>删除</span></button>';
                            return a + ' '+s+' '+ d;
                        },
                        events : {
                            'click .editPwd' : function(e, value, row, index) {
                                selectID = row.teacher_id;
                                $('#editPwd_modal').modal("show");
                            },
                            'click .edit' : function(e, value, row, index) {
                                selectID = row.teacher_id;
                                rowEditOperation(row,'edit');
                            },
                            'click .delete' : function(e,value, row, index) {
                                selectID = row.teacher_id;
                                $('#deleteWarning_modal').modal(
                                    'show');
                            }
                        }
                    } ],
                url : '/onlineEdu/teacher/getTeacherByPage',
                onLoadError:function(status){
                    handleAjaxError(status);
                },
                method : 'GET',
                queryParams : queryParams,
                sidePagination : "server",
                dataType : 'json',
                pagination : true,
                pageNumber : 1,
                pageSize: 10,
                pageList : [5, 10, 25, 50, 100 ],
                clickToSelect : true
            });
    }

    // 表格刷新
    function tableRefresh() {
        $('#dataList').bootstrapTable('refresh', {
            query : {}
        });
    }

    // 行编辑操作
    function rowEditOperation(row,model) {
        $('#add_modal').modal("show");
        $('#titleLable').html("修改数据");
        $('#modal_cancel').show();
        $('#modal_submit').show();
        action="edit";

        $('#teacherName').val(row.teacher_name);
        $('#subjectType').val(row.subject_type);
        $('#teacherSex').val(row.teacher_sex);
        $('#teacherPhone').val(row.teacher_phone);
    }

    //搜索课程列表
    function searchCourse(subject){
        $.ajax({
            url:"/onlineEdu/lesson/getLessonGroup",
            type: 'GET',
            cache: false,
            data:{},
            dataType:  "json",
            async:false,
            success: function (data) {
                var options = '<option value="">--请选择--</option>'+data.lessonGroup;
                $(subject).html(options);
            }
        });
    }

    // 刪除信息
    function deleteAction(){
        $('#delete_confirm').click(function(){
            var ids = '';
            var rows = $("#dataList").bootstrapTable('getSelections');
            for (var i = 0; i < rows.length; i++) {
                ids += "'"+rows[i]['teacher_id'] +"'"+ ",";
            }
            ids = ids.substring(0, ids.length - 1);
            var data = {
                "teacherId" : ids
            }
            deleteData(data);
        })
    }

    function deleteBatchAction() {
        //获取所有被选中的记录
        $('#batch_delete').click(function() {
            var rows = $("#dataList").bootstrapTable('getSelections');
            if (rows.length== 0) {
                alert("请先选择要删除的记录!");
            }else {
                $('#deleteWarning_modal').modal('show');
                // deleteAction();
            }
        });
    }

    function deleteData(data) {

        $.ajax({
            type : "GET",
            url : "/onlineEdu/teacher/delete",
            dataType : "json",
            contentType : "application/json",
            data : data,
            success : function(response){
                $('#deleteWarning_modal').modal("hide");
                var type;
                var msg;
                var append = '';
                if(response.success){
                    type = "success";
                    msg = "删除成功";
                }else{
                    type = "error";
                    msg = "删除失败";
                }
                showMsg(type, msg, append);
                tableRefresh();
            },
            error : function(response){
                $('#deleteWarning_modal').modal("hide");
                // handle error
                alert("失败");
            }
        })
        $('#deleteWarning_modal').modal('hide');
    }
    // 添加信息
    function submitAction() {
        $('#add').click(function() {
            $('#add_modal').modal("show");
            $('#titleLable').html("添加数据");
            $('#modal_cancel').show();
            $('#modal_submit').show();
            action = 'add';
            searchCourse("#subjectType")
        });

        $('#modal_submit').click(function() {
            var data = {
                teacherName:$('#teacherName').val(),
                teacherPhone:$('#teacherPhone').val(),
                teacherSex:$('#teacherSex').val(),
                subjectType:$('#subjectType').val()
            }
            if(!(data.teacherName&&data.teacherPhone&&data.teacherSex&&data.subjectType)) {
                alert("请填写完整！");
                return ;
            }
            var url;
            if(action =='edit'){
                url = "/onlineEdu/teacher/update";
                data.teacherId = selectID;
            }else{
                url = "/onlineEdu/teacher/save";
            }
            $.ajax({
                type : "POST",
                url :url,
                dataType : "json",
                data : data,
                success : function(response) {
                    $('#add_modal').modal("hide");
                    var msg;
                    var type;
                    var append = '';
                    if (response.success) {
                        type = "success";
                        msg = "操作成功";
                    } else {
                        type = "error";
                        msg = "失败";
                    }
                    showMsg(type, msg, append);
                    tableRefresh();
                    $('#teacherName').val("");
                    $('#subjectType').val("");
                    $('#teacherSex').val("");
                    $('#teacherPhone').val("");
                },
                error : function(xhr, textStatus, errorThrown) {
                    $('#add_modal').modal("hide");
                    // handle error
                    handleAjaxError(xhr.status);
                }
            })
        })
    }

    $('#edit_pwd_confirm').click(function() {

        var data = {
            "userId": selectID,
            "passWord": $('#pwd').val(),
            "surePassWord": $('#surePwd').val()
        }
        if(!(data.passWord&&data.surePassWord)) {
            alert("请填写完整！");
            return ;
        }
        if(data.passWord!=data.surePassWord) {
            alert("两次输入不一致！");
            return ;
        }
        $.ajax({
            type: "POST",
            url:"/onlineEdu/account/updatePwd",
            dataType:"json",
            data:data,
            success:function(response){
                $('#editPwd_modal').modal("hide");
                showMsg('success', '密码修改成功', '');
            },
            error:function(xhr, textStatus, errorThrown){
                // handler error
                handleAjaxError(xhr.status);
            }
        });
    });
</script>
<div class="panel panel-default">
	<ol class="breadcrumb">
		<li><label class="form-label">教师信息管理</label></li>
	</ol>
	<div class="panel-body">
		<div class="row">
			<div style="width: 100%;margin-top: -16px" class="box-content">
				<table id="信息查询" class="table table-bordered table-hover table-responsive">
					<tbody>
					<tr>
						<td class="item-title" align="center">姓名</td>
						<td class="item-content-half">
							<input type="text" class="form-control" id="teacherSearch" placeholder="">
						</td>
						<td class="item-title" align="center">手机号</td>
						<td class="item-content-half">
							<input type="text" class="form-control" id="phoneSearch" placeholder="">
						</td>
						<td class="item-title" align="center">教授科目</td>
						<td class="item-content-half">
							<%--<input type="text" class="form-control" id="subjectSearch" placeholder="">--%>
								<select id="subjectSearch" class="form-control">
								</select>
						</td>
					</tr>
					</tbody>
				</table>
			</div>

			<%--</div>--%>
		</div>
		<div style="text-align: right">
			<button id="search_button" style="text-align: right" class="btn btn-success">
				<span class="glyphicon glyphicon-search"></span> <span>查询</span>
			</button>
		</div>
	</div>

	<div class="row" style="margin-top: 25px">
		<div class="col-md-5">
			<button class="btn btn-sm btn-default" id="add">
				<span class="glyphicon glyphicon-plus"></span> <span>添加</span>
			</button>
			<button class="btn btn-sm btn-default" id="batch_delete">
				<span class="glyphicon glyphicon-export"></span> <span>批量删除</span>
			</button>
		</div>
		<div class="col-md-5"></div>
	</div>

	<div class="row" style="margin-top: 15px">
		<div class="col-md-12">
			<table id="dataList" class="table table-striped"></table>
		</div>
	</div>
</div>
</div>

<!-- 添加信息模态框 -->
<div id="add_modal" class="modal fade" table-index="-1" role="dialog"
	 aria-labelledby="myModalLabel" aria-hidden="true"
	 data-backdrop="static">
	<div class="modal-dialog">
		<div class="modal-content">
			<div class="modal-header">
				<button class="close" type="button" data-dismiss="modal"
						aria-hidden="true">&times;</button>
				<h4 class="modal-title" id="titleLable">添加信息</h4>
			</div>
			<div class="modal-body">
				<!-- 模态框的内容 -->
				<div class="row">
					<div class="col-md-1 col-sm-1"></div>
					<div class="col-md-8 col-sm-8">
						<form class="form-horizontal" role="form" id="student_form"
							  style="margin-top: 25px">
							<div class="form-group">
								<label  class="control-label col-md-4 col-sm-4"> <span>教师名称：</span>
								</label>
								<div class="col-md-8 col-sm-8">
									<input type="text" class="form-control" id="teacherName"
										   placeholder="教师名称">
								</div>
							</div>
							<div class="form-group">
								<label  class="control-label col-md-4 col-sm-4"> <span>性别：</span>
								</label>
								<div class="col-md-8 col-sm-8">
									<input type="text" class="form-control" id="teacherSex"
										   placeholder="性别">
								</div>
							</div>
							<div class="form-group">
								<label  class="control-label col-md-4 col-sm-4"> <span>手机号：</span>
								</label>
								<div class="col-md-8 col-sm-8">
									<input type="text" class="form-control" id="teacherPhone"
										   placeholder="手机号">
								</div>
							</div>
							<div class="form-group">
								<label  class="control-label col-md-4 col-sm-4"> <span>教授科目：</span>
								</label>
								<div class="col-md-8 col-sm-8">
									<input type="text" class="form-control" id="subjectType"
										   placeholder="教授科目">
								</div>
							</div>
						</form>
					</div>
					<div class="col-md-1 col-sm-1"></div>
				</div>
			</div>
			<div class="modal-footer">
				<button class="btn btn-default" type="button" data-dismiss="modal" id="modal_cancel">
					<span>取消</span>
				</button>
				<button class="btn btn-success" type="button" id="modal_submit">
					<span>提交</span>
				</button>
			</div>
		</div>
	</div>
</div>

<!-- 删除提示模态框 -->
<div class="modal fade" id="deleteWarning_modal" table-index="-1"
	 role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
	<div class="modal-dialog">
		<div class="modal-content">
			<div class="modal-header">
				<button class="close" type="button" data-dismiss="modal"
						aria-hidden="true">&times;</button>
				<h4 class="modal-title" id="myModalLabelee">警告</h4>
			</div>
			<div class="modal-body">
				<div class="row">
					<div class="col-md-3 col-sm-3" style="text-align: center;">
						<img src="" alt=""
							 style="width: 70px; height: 70px; margin-top: 20px;">
					</div>
					<div class="col-md-8 col-sm-8">
						<h3>是否确认删除该条记录</h3>
						<p></p>
					</div>
				</div>
			</div>
			<div class="modal-footer">
				<button class="btn btn-default" type="button" data-dismiss="modal">
					<span>取消</span>
				</button>
				<button class="btn btn-danger" type="button" id="delete_confirm">
					<span>确认删除</span>
				</button>
			</div>
		</div>
	</div>
</div>

<div class="modal fade" id="editPwd_modal" table-index="-1"
	 role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
	<div class="modal-dialog">
		<div class="modal-content">
			<div class="modal-header">
				<button class="close" type="button" data-dismiss="modal"
						aria-hidden="true">&times;</button>
				<h4 class="modal-title" >重置密码</h4>
			</div>
			<div class="modal-body">
				<div class="row">
					<div class="row">
						<div class="col-md-8 col-sm-8">
							<form class="form-horizontal" role="form"
								  style="margin-top: 25px">
								<div class="form-group">
									<label  class="control-label col-md-4 col-sm-4"> <span>设置密码：</span>
									</label>
									<div class="col-md-8 col-sm-8">
										<input type="password" class="form-control" id="pwd"
											   placeholder="设置密码">
									</div>
								</div>
								<div class="form-group">
									<label  class="control-label col-md-4 col-sm-4"> <span>再次输入：</span>
									</label>
									<div class="col-md-8 col-sm-8">
										<input type="password" class="form-control" id="surePwd"
											   placeholder="再次输入">
									</div>
								</div>
							</form>
						</div>
				</div>
			</div>
			<div class="modal-footer">
				<button class="btn btn-default" type="button" data-dismiss="modal">
					<span>取消</span>
				</button>
				<button class="btn btn-danger" type="button" id="edit_pwd_confirm">
					<span>确认</span>
				</button>
			</div>
		</div>
	</div>
	</div>
</div>